<!doctype html>
<html>
<head>
  <title>Google Wallet for Digital Payments</title>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="chrome=1">
  <!--<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">-->
  <!--<meta name="viewport" content="width=device-width, initial-scale=1.0">-->
  <!--This one seems to work all the time, but really small on ipad-->
  <!--<meta name="viewport" content="initial-scale=0.4">-->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <link rel="stylesheet" media="all" href="theme/css/default.css">
  <link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="theme/css/phone.css">
  <base target="_blank"> <!-- This amazingness opens all links in a new tab. -->
  <script data-main="js/slides" src="js/require-1.0.8.min.js"></script>
</head>

<body style="opacity: 0">

<slides class="layout-widescreen">
  <slide class="logoslide nobackground">
    <article class="flexbox vcenter">
      <span><img src="images/google_developers_logo.png"></span>
    </article>
  </slide>

  <slide class="title-slide segue nobackground">
    <aside class="gdbar"><img src="images/google_developers_icon_128.png"></aside>
    <!-- The content of this hgroup is replaced programmatically through the slide_config.json. -->
    <hgroup class="auto-fadein">
      <h1 data-config-title><!-- populated from slide_config.json --></h1>
      <h2 data-config-subtitle><!-- populated from slide_config.json --></h2>      
      <p data-config-presenter><!-- populated from slide_config.json --></p>
      <p>Slides URL - http://goo.gl/TDKGk</p>
    </hgroup>
  </slide>
  
  <slide>
    <h2>Agenda</h2>
    <br /><br />
    <ul class="build fade">
      <li>Google Wallet for Digital Goods</li>    
      <li>Setting Up</li>
      <li>Basic Purchase Page</li>
      <li>Merchant Center Introduction</li>
      <li>Let's Start Coding</li>
      <li>Server-side Stuff</li>
      <li>New Features</li>      
      <li>Tying It All Together</li>
    </ul>
  </slide>
  
  <slide class="fill nobackground" style="background-image: url(images/iap_video.png)">
    <aside class="bgbar">
      <h2 class="right">Google Wallet for Digital Goods</h2>
    </aside>
  </slide>
  
    <slide>
    <h2>Digital Goods Purchase Experience</h2>
    <br /><br />
    <ul>
      <li> True in-app experience </li>
      <li> Minimal integration </li>
    </ul> <br/>
    <article class="centered">  
      <img src="images/alien.png" style="width: 150px;">   
      <img src="images/geek.png" style="width: 150px;"> 
      <img src="images/cake.png" style="width: 150px; border: 2px green solid ;"> 
      <img src="images/Billy.png" style="width: 150px;"><br/><br/>
      <button onclick="buy();" id="runDemoButton"><b>Purchase</b></button>
    </article>      
  </slide>
  
    <slide>
    <h2>Wait... There's more!</h2>
    <br /><br />
    <b>Just launched at I/O:</b>
        <br /><br /><br />
    <ul>
      <li> Subscritions support </li>
        <br />    
      <li> Developer friendly fees (1.9% +30c  or  5% whicever is better) </li>
    </ul> <br/>
    
  </slide>  
  
  <slide class="fill nobackground" style="background-image: url(images/foundation.jpg)">
    <aside class="bgbar">
      <h2 class="right">Dev Environment Setup</h2>
    </aside>
  </slide>
  
  <slide>
    <h2>Get Code & Slides</h2>
     <br /><br />
    <!-- http://goo.gl/TDKGk -->
    <!-- http://commerce-io12.appspot.com/codelab/index.html -->      
    <p>Slides:</p>    
    <p>- <a href="http://goo.gl/TDKGk">http://goo.gl/TDKGk</a></p>    
    <p>- git clone https://code.google.com/p/google-wallet-io12-codelab/</p>
    <br />
    <p>Python project:</p>
    <p>- git clone https://code.google.com/p/iap-python/</p>
    <br />
    <p>Java project:</p>
    <p>- git clone http://code.google.com/p/commerce-io-12-codelab/</p>    
  </slide>
  
  <slide>
    <h2>Create Sandbox Wallet Accounts</h2>
    <br /><br />
    <h3>
<p><b>Sandbox Buyer Account - </b> Click  >>> <button onclick="buy();" id="runDemoButton"><b>Purchase</b></button></p>
<p> - use a "test" credit card (VISA: 4111 1111 1111 1111, CVC: 123, Exp: 12/13)<br/>
    - fill in your name and any valid zip code
</p><br/>
      
   <p><b>Sandbox Merchant Account - <a href="http://goo.gl/4N11S">http://goo.gl/4N11S</a></b></p>
<p> - use "12 3456789" for Federal Tax Id <br/>
- complete all fields
</p><br/>
</h3>
  </slide>
  
  <slide>
    <h2>Development Environment</h2>
    <br /><br />
    <ul>
      <li>AppEngine account - <a href="http://appspot.com">http://appspot.com</a></li> <br/>
      <li>AppEngine SDK for Java - <a href="http://goo.gl/Hv02a">http://goo.gl/Hv02a</a></li>
      <li>Java Plugin for Eclipse - <a href="http://goo.gl/hBFBL">http://goo.gl/hBFBL</a> </li>  <br/>
      <li>AppEngine SDK for Python - <a href="http://goo.gl/cXZT8">http://goo.gl/cXZT8</a></li>
      <li>Python Plugin for Eclipse (optional) - <a href="http://pydev.org">http://pydev.org</a> </li>  <br/>
      <li>Documentation - <a href="http://developers.google.com/in-app-payments">http://developers.google.com/in-app-payments</a> </li>  <br/>
    </ul>
  </slide>
  
  <slide class="fill nobackground" style="background-image: url(images/trainingwheels.jpg)">
    <aside class="bgbar">
      <h2 class="right">Basic Purchase Page</h2>
    </aside>
  </slide>
  
  <slide>
    <h2>In-App Payments libraries</h2>
    <br />
<pre class="prettyprint" data-lang="javascript">
&lt;script type=&quot;text/javascript&quot; src=&quot;https://www.google.com/jsapi&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot;&gt;
  google.load(&#x27;payments&#x27;, &#x27;1.0&#x27;, {
    &#x27;packages&#x27;: [&#x27;sandbox_config&#x27;]
  });
&lt;/script&gt;
</pre>
  </slide>
  
  <slide>
    <h2>One API call to purchase</h2>
     <br />
    <pre class="prettyprint" data-lang="javascript">
&lt;script type=&quot;text/javascript&quot;&gt;
function buy() {
  goog.payments.inapp.buy({
    parameters: {},
    jwt: &quot;eyJhbGciOiJIUzI1NiJ9.eyJpc3MiOiIxNDIwNDk&quot; +
    &quot;1MzA5NDM1MjE2ODU3MSIsImF1ZCI6Ikdvb2dsZSI&quot; +
    &quot;sInR5cCI6Imdvb2dsZS9wYXltZW50cy9pbmFwcC9&quot; +
    &quot;pdGVtL3YxIiwiaWF0IjoxMzM5NzA1OTkxLCJleHA&quot; +
    &quot;iOjI0MDAwMDAwMDAsInJlcXVlc3QiOnsibmFtZSI&quot; +
    &quot;6IlBpZWNlIG9mIENha2UiLCJkZXNjcmlwdGlvbiI&quot; +
    &quot;6IkEgZGVsaWNpb3VzIHBpZWNlIG9mIHZpcnR1YWw&quot; +
    &quot;gY2FrZSIsInByaWNlIjoiMTAuNTAiLCJjdXJyZW5&quot; +
    &quot;jeUNvZGUiOiJVU0QiLCJzZWxsZXJEYXRhIjoiWW9&quot; +
    &quot;1ciBEYXRhIEhlcmUifX0.hUTiA_mWYJ3TaUAuil-&quot; +
    &quot;_88ACHuvo5koEtgnVXqHwX_0&quot;,
    success: function() {window.alert(&quot;success&quot;)},
    failure: function() {window.alert(&quot;failure&quot;)}
  });
}
&lt;/script&gt;
    </pre>
  </slide>
  
  <slide>
    <h2>Buy Button</h2>
    <br />
    <pre class="prettyprint" data-lang="javascript">
&lt;!--- place button in the appropriate place on your page--&gt;
&lt;button onclick=&quot;buy();&quot; id=&quot;runDemoButton&quot; value=&quot;buy&quot;&gt;&lt;b&gt;Purchase&lt;/b&gt;&lt;/button&gt;
    </pre>
    <button onclick="buy();" id="runDemoButton" value="buy"><b>Purchase</b></button>
  </slide>
  
  
  <slide class="fill nobackground" style="background-image: url(images/ikea.jpg)">
    <aside class="bgbar">
      <h2 class="right">Merchant Center</h2>
    </aside>
  </slide>
  
  <slide>
    <h2>Merchant Center</h2>
    <br/>
      <a href="https://sandbox.google.com/checkout/sell">https://sandbox.google.com/checkout/sell</a>    
    <article class="flexbox vcenter">
      <img src="images/checkoutmerchantcenter.gif" class="reflect"> 
    </article>
  </slide>
  
  <slide class="fill nobackground" style="background-image: url(images/package.jpg)">
    <aside class="bgbar">
      <h2 class="right">Let's Start Coding</h2>
    </aside>
  </slide>
  
  <slide>
    <hgroup>
      <h2>Libraries</h2>
    </hgroup>
    <article>
      <ul>
        <li>Java Library <br/>
        - <a href="http://code.google.com/p/jsontoken">http://code.google.com/p/jsontoken</a></li>
        <li>Python Library <br/>
        - <a href="https://github.com/progrium/pyjwt">https://github.com/progrium/pyjwt</a></li>
        <li>Other Langauges <br/>
        - <a href="https://developers.google.com/in-app-payments/docs/libraries">https://developers.google.com/in-app-payments/docs/libraries</a></li>
      </ul>
    </article>
  </slide>
  
  <slide>
    <hgroup>
      <h2>JWT format</h2>
    </hgroup>
    <article>
    <ul>
      <li>Base64 encoded data<br /> <br />
      <li>header.body.signature<br /><br />
      <li>JWT decoder <br />
      - <a href="https://developers.google.com/in-app-payments/docs/jwtdecoder">https://developers.google.com/in-app-payments/docs/jwtdecoder</a><br/><br/>
      <li> Use <b>atob( "encoded_JW" )</b> in browser console:<p>
 atob("eyJhdWQiOiAiR29vZ2xlIiwgImlzcyI6ICIxMDg3MzY2MDM1NDYy<br />
 MDA5NDcxNiIsICJyZXF1ZXN0IjogeyJwcmljZSI6ICI5Ljk5IiwgImN1cn<br />
 .....
 92MSJ9");</p>
    </article>
  </slide>
  
   <slide>
     <hgroup>
       <h2>JWT Format</h2>
     </hgroup>
     <article>
       <pre data-lang="javascript">
{ 
   &quot;iss&quot; : &quot;1337133713371337&quot;,
   &quot;aud&quot; : &quot;Google&quot;
   &quot;typ&quot; : &quot;google/payments/inapp/item/v1&quot;,
   &quot;exp&quot; : &quot;1309988959&quot;,
   &quot;iat&quot; : &quot;1409988959&quot;,
   &quot;request&quot; :{
     &quot;name&quot; : &quot;Piece of Cake&quot;,
     &quot;description&quot; : &quot;Virtual chocolate cake to fill your virtual tummy&quot;,
     &quot;price&quot; : &quot;10.50&quot;,
     &quot;currencyCode&quot; : &quot;USD&quot;,
     &quot;sellerData&quot; : &quot;user_id:1224245,offer_code:3098576987,affiliate:aksdfbovu9j&quot;
  }
}     
       </pre>
     </article>
   </slide>
   
    <slide>
    <h2>Python Project </h2>
    <br /><br/>
      <p>The <b>'project'</b> directory contains skeleton code for this lab.
</p> <br/>
      <p>Add the required functionality to <b>'main.py'</b> and <b>'templates/index.html'</b>
</p> <br/>

<p>The <b>'src'</b> directory contains a working sample you can use to compare with your implementation.</p> <br/>

  </slide>   
  
   
  
    <slide>
    <h2>Python - AppEngine account (Step 1) </h2>
    <br />
      <img src="images/ae_create.png"> <br />
  </slide>    
  
    <slide>
    <h2>Python - app.yaml config file (Step 2) </h2>
    <br />
    <p>Change application id to someting unique (e.g. iap-{name initials}): </p> <br>
<pre class="prettyprint" data-lang="yaml">
application: iap-name
version: 1-1
runtime: python
api_version: 1

handlers:
- url: /.*
  script: main.py

- url: /images
  static_dir: images

- url: /stylesheets
  static_dir: stylesheets
</pre>
  </slide>   
  
    <slide>
    <h2>Python - Seller Id and Secret (Step 3) </h2>
    <br /><br/>
      <p>From Sandbox Seller Account: <b><a href="http://goo.gl/4N11S">http://goo.gl/4N11S</a></b></p> <br/>
      <p>Update Seller Id and Seller Secret in <b>sellerinfo.py</b>:</p> <br/>
<pre class="prettyprint" data-lang="python">
SELLER_ID = "YOUR SELLER ID"
SELLER_SECRET = "YOUR SELLER SECRET"

</pre>
  </slide>   

  <slide>
    <h2>Python - Purchase page template (Step 4) </h2>
    <br />
<pre class="prettyprint" data-lang="javascript">
&lt;script type=&quot;text/javascript&quot; src=&quot;https://www.google.com/jsapi&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot;&gt;
  google.load(&#x27;payments&#x27;, &#x27;1.0&#x27;, {
    &#x27;packages&#x27;: [&#x27;sandbox_config&#x27;]
  });

function purchase(item) {
  // TODO: Add code for digital items purchase
}
&lt;/script&gt;

&lt;button onclick=&quot;purchase('Item');&quot; id=&quot;runDemoButton&quot;&gt;&lt;b&gt;Purchase&lt;/b&gt;&lt;/button&gt;
</pre>
  </slide>
  
<!--   
  <slide>
    <h2>Python - Purchase page template (Step 4) </h2>
    <br />
<pre class="prettyprint" data-lang="javascript">
&lt;script type=&quot;text/javascript&quot; src=&quot;https://www.google.com/jsapi&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot;&gt;
  google.load(&#x27;payments&#x27;, &#x27;1.0&#x27;, {
    &#x27;packages&#x27;: [&#x27;sandbox_config&#x27;]
  });

function purchase(item) {
  goog.payments.inapp.buy({
    jwt: {{generated_jwt}},
    success: function() {console.log(&quot;success&quot;)},
    failure: function() {console.log(&quot;failure&quot;)}
  });
}
&lt;/script&gt;

&lt;button onclick=&quot;purchase('Item');&quot; id=&quot;runDemoButton&quot;&gt;&lt;b&gt;Purchase&lt;/b&gt;&lt;/button&gt;
</pre>
  </slide>
 -->
 
    <slide>
    <h2>Python - Server-side JWT handler (Step 5) </h2>
    <br />
<pre class="prettyprint" data-lang="python">
class MainHandler(webapp.RequestHandler):
  def get(self):
    # TODO: Implement JWT generation
    # sample_token = jwt.encode( ...)

    template_values = {'generated_jwt': sample_token}
    path = os.path.join(os.path.dirname(__file__), 'templates', 'index.html')
    self.response.out.write(template.render(path, template_values))
</pre>
  </slide>  
  
  
    <slide>
    <h2>Python - Run & test app (Step 6) </h2>
    <br />
<pre class="prettyprint" data-lang="shell">
dev_appserver.py --port=9999 iap-name

Launch http://localhost:9999/
</pre>  
  </slide> 
  <slide>
    <h2>Java Project </h2>
    <br />
    <ul>
      <li>gwdg-demo-skeleton - skeleton project to fill out</li>
      <li>gwdg-demo-complete - full reference project</li>
      <li>java-libraries - libraries for jwt generation</li>
    </ul>
  </slide>
    
  <slide>
    <hgroup>
      <h2>Java Eclipse Project (Step 1)</h2>
    </hgroup>
    <article>
      Create New Web App Project<br />
      <img src="images/appenginestep1.png"> <br />
      Uncheck Use Google Web Toolkit
    </article>
  </slide>
  
  <slide>
    <hgroup>
      <h2>Java Eclipse Project (Step 2)</h2>
    </hgroup>
    <article>
      Insert your application name in war/WEB-INF/appengine-web.xml
    </article>
    <pre class="prettyprint" data-lang="xml">
&lt;appengine-web-app xmlns=&quot;http://appengine.google.com/ns/1.0&quot;&gt;
  &lt;application&gt;&lt;/application&gt;
  &lt;version&gt;1&lt;/version&gt;
    </pre>
    <article>
      Run application
    </article>
  </slide>
  
  <slide>
    <hgroup>
      <h2>Java Eclipse Project (Step 3)</h2>
    </hgroup>
    <article>
      Add Id & Secret to web.xml<br />
    </article>
    <pre class="prettyprint" data-lang="xml">
&lt;context-param&gt;
	&lt;param-name&gt;sellerId&lt;/param-name&gt;
	&lt;param-value&gt;[SellerId]&lt;/param-value&gt;
&lt;/context-param&gt;

&lt;context-param&gt;
	&lt;param-name&gt;sellerSecret&lt;/param-name&gt;
	&lt;param-value&gt;[SellerSecret]&lt;/param-value&gt;
&lt;/context-param&gt;
    </pre>
  </slide>
  
  <slide>
    <hgroup>
      <h2>Java Eclipse Project (Step 4)</h2>
    </hgroup>
    <article>
      Create or update servlet<br />
    </article>
    <pre class="prettyprint" data-lang="java">
public void doPost(HttpServletRequest req, HttpServletResponse resp)
     throws IOException {
   String sellerId = getServletContext().getInitParameter(&quot;sellerId&quot;);
   String sellerSecret = getServletContext().getInitParameter(&quot;sellerSecret&quot;);
   Request request = new Request(&quot;Item Name&quot;,
       &quot;Item Description&quot;,
       &quot;10.00&quot;,
       Request.Currencies.valueOf(&quot;USD&quot;),
       &quot;Seller Data&quot;);
   InAppJWT iap = new InAppJWT(request);
   IapService iapService = new IapService(sellerId, sellerSecret);
   String iapJWT = iapService.jwtToString(iap);
   resp.setContentType(&quot;text/plain&quot;);
   resp.getWriter().println(iapJWT);
}
    </pre>
  </slide>

  <slide>
    <hgroup>
      <h2>Java Eclipse Project (Step 5)</h2>
    </hgroup>
    <article>
      Request Server Generated JWT<br />
    </article>
    <pre class="prettyprint" data-lang="javascript">
&lt;script type=&quot;text/javascript&quot;
  src=&quot;https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js&quot;&gt;&lt;/script&gt;
var success = function(data){
  goog.payments.inapp.buy({
      jwt: data,
      success: function(success) {console.log(success);  window.alert(&quot;success&quot;)},
      failure: function(error) {console.log(error); window.alert(&quot;failure&quot;)}
    });
    return false;
  };
}
function buy(){
  $.post(&quot;iap&quot;, success);
}
    </pre>
  </slide>
   <slide>
    <hgroup>
      <h2>Java Eclipse Project (Step 6)</h2>
    </hgroup>
    <article>
      Debug and deploy to Appengine<br />
      <img src="images/deploy.png" class="reflect"> <br />
    </article>
  </slide>
  
 <!-- 
  <slide>
    <hgroup>
      <h2>TODO: See if we can add subscriptions</h2>
    </hgroup>
  </slide>
-->  
  <slide class="fill nobackground" style="background-image: url(images/network.jpg)">
    <aside class="bgbar">
      <h2 class="right">Server-side Stuff</h2>
    </aside>
  </slide>
      
  <slide>
    <h2>Python postback handler </h2>
    <br />
<pre class="prettyprint" data-lang="python">
  def post(self):
    encoded_jwt = self.request.get('jwt', None)
    if encoded_jwt is not None:
      decoded_jwt = jwt.decode(str(encoded_jwt), SELLER_SECRET)

      # validate the payment request and respond back to Google
      if decoded_jwt['iss'] == 'Google' and decoded_jwt['aud'] == SELLER_ID:
        if ('response' in decoded_jwt and
            'orderId' in decoded_jwt['response'] and
            'request' in decoded_jwt):
          order_id = decoded_jwt['response']['orderId']
          request_info = decoded_jwt['request']
          if ('currencyCode' in request_info and 'sellerData' in request_info
              and 'name' in request_info and 'price' in request_info):            
            # respond back to complete payment
            self.response.out.write(order_id)
</pre>  
  </slide> 
  
  <slide>
    <hgroup>
      <h2>Java postback handler servlet</h2>
    </hgroup>
    <article>
      Create or update servlet<br />
    </article>
    <pre class="prettyprint" data-lang="java">
String jwt = req.getParameter("jwt");
IapService iapService = 
  new IapService(getServletContext().getInitParameter("sellerId"),
  getServletContext().getInitParameter("sellerSecret"));

InAppJWT iapJwt = iapService.stringToJwt(jwt);

try {
  PrintWriter out = resp.getWriter();
  out.print(iapJwt.getResponse().getOrderId());
  out.flush();
  out.close();
} catch (IOException e) {
  e.printStackTrace();
}
    </pre>
  </slide>
  
  <slide>
    <hgroup>
      <h2>Update your postback URL</h2>
    </hgroup>
    <article>
    <br />
      <p>Login at: <a href="http://goo.gl/4N11S">http://goo.gl/4N11S</a></p>
      <p>Enter your post back as http://[application name].appspot.com/[handler path]</p>
      <img src="images/iapmc.png" class="reflect"> 
    </article>
  </slide>
  
  <slide class="fill nobackground" style="background-image: url(images/deathstar.jpg)">
    <aside class="bgbar">
      <h2 class="right">New Features</h2>
    </aside>
  </slide>  
  
     <slide>
     <hgroup>
       <h2>Subscriptions JWT</h2>
     </hgroup>
     <article class="smaller">
       <pre data-lang="javascript">
{
  &quot;iss&quot; : sellerIdentifier,
  &quot;aud&quot; : &quot;Google&quot;,
  &quot;typ&quot; : &quot;google/payments/inapp/subscription/v1&quot;,
  &quot;exp&quot; : int(time.time() + 3600),
  &quot;iat&quot; : int(time.time()),
  &quot;request&quot; :{
    &quot;name&quot; : &quot;Weekly Cake&quot;,
    &quot;description&quot; : &quot;Virtual chocolate cake to fill your virtual tummy every week&quot;,
    &quot;sellerData&quot; : &quot;user_id:1224245,offer_code:3098576987,affiliate:aksdfbovu9j&quot;,
    &quot;initialPayment&quot; : {
      &quot;price&quot; : &quot;1.49&quot;,
      &quot;currencyCode&quot; : &quot;USD&quot;,
      &quot;paymentType&quot; : &quot;prorated&quot;,
    },
    &quot;recurrence&quot; : {
      &quot;price&quot; : &quot;4.99&quot;,
      &quot;currencyCode&quot; : &quot;USD&quot;,
      &quot;startTime&quot; : int(time.time() + 2600000),
      &quot;frequency&quot; : &quot;monthly&quot;,
      &quot;numRecurrences&quot; : &quot;12&quot;,
    }
  }
}    
       </pre>
     </article>
   </slide>
   
 <!--  
  <slide class="fill nobackground" style="background-image: url(images/deathstar.jpg)">
    <aside class="bgbar">
      <h2 class="right">Putting It Together</h2>
    </aside>
  </slide>
  
    <slide>
    <h2>Sample App</h2>
    <br /><br />
    <h3><ul>
      <li>Python - http://iap-py.appspot.com</li>
    </ul></h3>
  </slide>
--> 
  
  <slide class="thank-you-slide segue nobackground">
    <aside class="gdbar right"><img src="images/google_developers_icon_128.png"></aside>
    <article class="flexbox vleft auto-fadein">
      <h2>Thank You!</h2>
    </article>
    <p class="auto-fadein" data-config-contact>
      <!-- populated from slide_config.json -->
    </p>
  </slide>

  <slide class="logoslide dark nobackground">
    <article class="flexbox vcenter">
      <span><img src="images/google_developers_logo_white.png"></span>
    </article>
  </slide>
               
  <slide class="backdrop"></slide>
  </slide>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load('payments', '1.0', {
    'packages': ['sandbox_config']
  });
  function buy() {
      goog.payments.inapp.buy({
        parameters: {},
        jwt: "eyJhbGciOiJIUzI1NiJ9.eyJpc3MiOiIxNDIwNDk" +
        "1MzA5NDM1MjE2ODU3MSIsImF1ZCI6Ikdvb2dsZSI" +
        "sInR5cCI6Imdvb2dsZS9wYXltZW50cy9pbmFwcC9" +
        "pdGVtL3YxIiwiaWF0IjoxMzM5NzA1OTkxLCJleHA" +
        "iOjI0MDAwMDAwMDAsInJlcXVlc3QiOnsibmFtZSI" +
        "6IlBpZWNlIG9mIENha2UiLCJkZXNjcmlwdGlvbiI" +
        "6IkEgZGVsaWNpb3VzIHBpZWNlIG9mIHZpcnR1YWw" +
        "gY2FrZSIsInByaWNlIjoiMTAuNTAiLCJjdXJyZW5" +
        "jeUNvZGUiOiJVU0QiLCJzZWxsZXJEYXRhIjoiWW9" +
        "1ciBEYXRhIEhlcmUifX0.hUTiA_mWYJ3TaUAuil-" +
        "_88ACHuvo5koEtgnVXqHwX_0",
        success: function() {window.alert("success")},
        failure: function() {window.alert("failure")}
      });
  }
</script>
</slides>
</body>